<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/bootstrap-3.3.7-dist\css\bootstrap.css">
</head>

<body>
    <input type="text" value="user" id="zxt111">
    <button onclick="onclickFunction()" class="btn btn-info">验证</button>

    <script>
        function onclickFunction() {
            var username = document.getElementById("zxt111");
            //alert(username);
            var testDemo = username.value;
            // alert(testDemo);
            //正则表达式做验证
            var patt = /^\w{5,12}$/;
            if (patt.test(testDemo)) {
                alert("是一个合法的用户名")

            } else {
                alert("输入的用户名不合法！")
            }
        }
    </script>
</body>

</html>